﻿<%@ Page Title="" Language="C#" MasterPageFile="~/SitePagePopUp.Master" AutoEventWireup="true" CodeBehind="Them-Quy-Dinh-Khen-Thuong.aspx.cs" Inherits="TranTekBE.KPI_NhanSu.Them_Quy_Dinh_Khen_Thuong" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
    <link href="../Maintenance/css/bootstrap.css" rel="stylesheet" />
    <link href="../Maintenance/css/custom.css" rel="stylesheet" />
    <link href="../Maintenance/css/whmcs.css" rel="stylesheet" />
    <script src="../Scripts/jsLib.js"></script>
    <!------------------------------>
<!--script auto complete ddl !-->
<!------------------------------>
    
     <style>
       .ui-button { margin-left: -1px; }
       .ui-button-icon-only .ui-button-text { padding: 0.35em; }
       .ui-autocomplete-input { margin: 0; padding: 0.48em 0 0.47em 0.45em; font:10px }
     </style>
 <!------------------------------>
 <!--End script auto complete ddl !-->
 <!------------------------------>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="BodyPopupContent" runat="server">
    
        <div style="margin-left: 0px; margin-top: 0px;">
            <div id="left_event" style="border: 1px solid #000; padding: 10px;">
                <div style="color: #222; margin-bottom: 5px; background-color: #B7B7B7; padding: 11px; margin-left: 0px;">
                    <h3>Thêm Quy Định Khen Thưởng</h3>
                </div>
                <asp:Label ID="ltrErr" runat="server"></asp:Label>
                <div style="margin-top: 20px">
                    <asp:TextBox ID="txtEvent" runat="server" placeholder="Tên khen thưởng"></asp:TextBox>
                    <asp:DropDownList ID="droplist_Diem_Thuong" runat="server">
                    </asp:DropDownList>
                    <asp:TextBox ID="txtNgay_them_vao" runat="server" placeholder="Ngày thêm vào"></asp:TextBox>
                    <asp:Button ID="btnAddEvent" runat="server" Text="Chấp Nhận Thêm" OnClick="btnAddEvent_Click" Width="200px" BackColor="#DBDEE1" Font-Bold="true" />
                </div>
            </div>
            <div id="right_event" style="border: 1px solid #000; padding: 10px;">

                <div style="color: #222; margin-bottom: 5px; background-color: #B7B7B7; padding: 11px; margin-left: 0px;">
                    <h3>Hiển Thị Các Quy Định Khen Thưởng</h3>
                </div>
                <div style="margin-top: 20px;">
                    <div class="demo" style="width: 202px; float: left;margin-top: -2px;">
                        <div class="ui-widget">
                            <asp:DropDownList ID="droplist_User_loc_kq" runat="server" OnSelectedIndexChanged="droplist_User_loc_kq_SelectedIndexChanged" >
                            </asp:DropDownList>
                        </div>
                        <button id="toggle" style="display: none">Show underlying select</button>
                    </div>


                    <asp:TextBox ID="txt_thoi_gian_loc" runat="server" placeholder="Chọn ngày tạo" OnTextChanged="txt_thoi_gian_loc_TextChanged"></asp:TextBox>
                    <asp:Button ID="btnLoc" runat="server" Text="LỌC" OnClick="btnLoc_Click" Width="200px" BackColor="#DBDEE1" Font-Bold="true"/>
                </div>
                <table class="table table-striped table-framed table-centered" style="width: 954px; margin-top: 25px;">
                    <thead>
                        <tr>
                            <th>STT.</th>
                            <th>Quy Định</th>
                            <th>Tiền Thưởng</th>
                            <th>Ngày Thêm</th>
                            <th>Người Thêm</th>
                            <th></th>
                        </tr>
                    </thead>
                    <tbody>
                        <asp:Repeater ID="rpEvent" runat="server" OnItemCommand="rpEventDetails_ItemCommand">
                            <ItemTemplate>
                                <tr style="<%# ThuVien.FunctionsUtils.CSS_RowInTable(Container.ItemIndex,"#FFFFE0","#D7E3F2") %>">
                                    <td class="tdGrid tdCenterM"><%# Container.ItemIndex + 1 %></td>
                                    <td class="tdGrid tdCenterM">
                                        <%# Eval("NAME_EVENT") %>
                                    </td>
                                    <td class="tdGrid tdCenterM"><%#ThuVien.FunctionsUtils.ConvertMoneyVND( Eval("TIEN_THUONG")).ToString() %> vnđ</td>
                                    <!--chua format date time-->
                                    <td class="tdGrid tdCenterM"><%# Convert.ToDateTime(Eval("NGAY_TAO")).ToShortDateString() %></td>
                                    <td class="tdGrid tdCenterM"><%# Eval("NGUOI_TAO") %></td>
                                    <td style="width: 50px" class="tdGrid tdCenterM">
                                        <asp:LinkButton ID ="imgbtnDel" runat="server" CommandName='Delete' CommandArgument='<%# Eval("ID_DROPLIST_EVENT") %>' ImageUrl="~/images/KPI/X.png">
                                        <img alt="Xóa" src="../images/KPI/X.png" />
                                        </asp:LinkButton>
                                    </td>
                                </tr>
                            </ItemTemplate>
                        </asp:Repeater>

                        <div style="overflow: hidden">

                            <asp:Repeater ID="rptPages" runat="server"
                                OnItemCommand="rptPages_ItemCommand_Event">

                                <ItemTemplate>

                                    <asp:LinkButton ID="btnPage"
                                        Style="padding: 1px 3px; margin: 1px; background: #ccc; border: solid 1px #666; font: 8pt tahoma;"
                                        CommandName="Page" CommandArgument="<%# Container.DataItem %>"
                                        runat="server"><%# Container.DataItem %>

                                    </asp:LinkButton>

                                </ItemTemplate>

                            </asp:Repeater>

                        </div>

                    </tbody>
                </table>

            </div>
        </div>
        

    <script type="text/javascript">
        function LoadJS() {
            $("#<%=txtNgay_them_vao.ClientID %>").datepicker(
                    {
                        changeMonth: true,
                        changeYear: true,
                        showButtonPanel: true,
                        dateFormat: "mm/dd/yy",
                        monthNames: ["Tháng 1", "Tháng 2", "Tháng 3", "Tháng 4", "Tháng 5", "Tháng 6", "Tháng 7", "Tháng 8", "Tháng 9", "Tháng 10", "Tháng 11", "Tháng 12"],
                        monthNamesShort: ["1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12"],
                        dayNamesMin: ["CN", "Th2", "Th3", "Th4", "Th5", "Th6", "Th7"],
                        dayNamesShort: ["CN", "Th2", "Th3", "Th4", "Th5", "Th6", "Th7"],
                        dayNames: ["Chủ Nhật", "Thứ 2", "Thứ 3", "Thứ 4", "Thứ 5", "Thứ 6", "Thứ 7"],
                        beforeShow: function () {
                            $(".ui-datepicker").css('font-size', 12)
                        }
                    }
                    );
            $("#<%=txt_thoi_gian_loc.ClientID %>").datepicker(
                   {
                       changeMonth: true,
                       changeYear: true,
                       showButtonPanel: true,
                       dateFormat: "mm/dd/yy",
                       monthNames: ["Tháng 1", "Tháng 2", "Tháng 3", "Tháng 4", "Tháng 5", "Tháng 6", "Tháng 7", "Tháng 8", "Tháng 9", "Tháng 10", "Tháng 11", "Tháng 12"],
                       monthNamesShort: ["1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12"],
                       dayNamesMin: ["CN", "Th2", "Th3", "Th4", "Th5", "Th6", "Th7"],
                       dayNamesShort: ["CN", "Th2", "Th3", "Th4", "Th5", "Th6", "Th7"],
                       dayNames: ["Chủ Nhật", "Thứ 2", "Thứ 3", "Thứ 4", "Thứ 5", "Thứ 6", "Thứ 7"],
                       beforeShow: function () {
                           $(".ui-datepicker").css('font-size', 12)
                       }
                   }
                   );
            
        }

    </script>
    <script type="text/javascript">
        //-----------------------------------------------
        //script auto complete ddl
        //-----------------------------------------------
        function optionSelected(selectedValue) {
            document.title = selectedValue;
        }

        (function ($) {
            $.widget("ui.combobox", {
                _create: function () {
                    var self = this,
                               select = this.element.hide(),
                               selected = select.children(":selected"),
                               value = selected.val() ? selected.text() : "";
                    var input = this.input = $("<input placeholder='Chọn tên nhân viên'>")
                               .insertAfter(select)
                               .val(value)
                               .autocomplete({
                                   delay: 0,
                                   minLength: 0,
                                   source: function (request, response) {
                                       var matcher = new RegExp($.ui.autocomplete.escapeRegex(request.term), "i");
                                       response(select.children("option").map(function () {
                                           var text = $(this).text();
                                           if (this.value && (!request.term || matcher.test(text)))
                                               return {
                                                   label: text.replace(
                                                                        new RegExp(
                                                                               "(?![^&;]+;)(?!<[^<>]*)(" +
                                                                               $.ui.autocomplete.escapeRegex(request.term) +
                                                                               ")(?![^<>]*>)(?![^&;]+;)", "gi"
                                                                        ), "$1"),
                                                   value: text,
                                                   option: this
                                               };
                                       }));
                                   },
                                   select: function (event, ui) {
                                       ui.item.option.selected = true;
                                       self._trigger("selected", event, {
                                           item: ui.item.option
                                       });
                                       //JK
                                       optionSelected(ui.item.option.value);

                                   },
                                   change: function (event, ui) {
                                       if (!ui.item) {
                                           var matcher = new RegExp("^" + $.ui.autocomplete.escapeRegex($(this).val()) + "$", "i"),
                                                           valid = false;
                                           select.children("option").each(function () {
                                               if ($(this).text().match(matcher)) {
                                                   this.selected = valid = true;
                                                   return false;
                                               }
                                           });
                                           if (!valid) {
                                               // remove invalid value, as it didn't match anything
                                               $(this).val("");
                                               select.val("");
                                               input.data("autocomplete").term = "";
                                               return false;
                                           }
                                       }
                                   }
                               })
                               .addClass("ui-widget ui-widget-content ui-corner-left");

                    input.data("autocomplete")._renderItem = function (ul, item) {
                        return $("<li></li>")
                                      .data("item.autocomplete", item)
                                      .append("<a>" + item.label + "</a>")
                                       .appendTo(ul);
                    };

                    this.button = $("<button type='button'>&nbsp;</button>")
                               .attr("tabIndex", -1)
                               .attr("title", "Show All Items")
                               .insertAfter(input)
                               .button({
                                   icons: {
                                       primary: "ui-icon-triangle-1-s"
                                   },
                                   text: false
                               })
                               .removeClass("ui-corner-all")
                               .addClass("ui-corner-right ui-button-icon")
                               .click(function () {
                                   // close if already visible
                                   if (input.autocomplete("widget").is(":visible")) {
                                       input.autocomplete("close");
                                       return;
                                   }

                                   // pass empty string as value to search for, displaying all results
                                   input.autocomplete("search", "");
                                   input.focus();
                               });
                },

                destroy: function () {
                    this.input.remove();
                    this.button.remove();
                    this.element.show();
                    $.Widget.prototype.destroy.call(this);
                }
            });
        })(jQuery);

        $(function () {
            $("#<%= droplist_User_loc_kq.ClientID%>").combobox();
                $("#toggle").click(function () {
                    $("#<%= droplist_User_loc_kq.ClientID%>").toggle();
                });
            });
            //-----------------------------------------------
            //End script auto complete ddl
            //-----------------------------------------------

        </script>
</asp:Content>
